<div class="container">
  <page-header title="Admin">
  </page-header>

  <div class="bg-white tiled">
    <ul class="tab-nav">
      <li><a href="admin/status">System Status</a></li>
      <li class="active"><a href="admin/queries/tasks">Queries Queue</a></li>
      <li><a href="admin/queries/outdated">Outdated Queries</a></li>
    </ul>

    <ul class="tab-nav">
      <rd-tab tab-id="in_progress" name="In Progress ({{tasks.in_progress.length}})" ng-click="setTab('in_progress')"></rd-tab>
      <rd-tab tab-id="waiting" name="Waiting ({{tasks.waiting.length}})" ng-click="setTab('waiting')"></rd-tab>
      <rd-tab tab-id="done" name="Done" ng-click="setTab('done')"></rd-tab>
    </ul>

    <table class="table table-condensed table-hover">
      <thead>
      <tr>
        <th>Data Source ID</th>
        <th>Username</th>
        <th>State</th>
        <th>Query ID</th>
        <th>Query Hash</th>
        <th>Runtime</th>
        <th>Created At</th>
        <th>Started At</th>
        <th>Updated At</th>
        <th ng-if="selectedTab === 'in_progress'"></th>
      </tr>
      </thead>
      <tbody>
      <tr ng-repeat="row in $ctrl.tasksPaginator.getPageRows()">
        <td>{{row.data_source_id}}</td>
        <td>{{row.username}}</td>
        <td>{{row.state}} <span ng-if="row.state === 'failed'" uib-popover="{{row.error}}" popover-trigger="mouseenter" class="zmdi zmdi-help"></span></td>
        <td><a href="queries/{{row.query_id}}">{{row.query_id}}</a></td>
        <td>{{row.query_hash}}</td>
        <td>{{row.run_time | durationHumanize}}</td>
        <td>{{row.created_at | toMilliseconds | dateTime }}</td>
        <td>{{row.started_at | toMilliseconds | dateTime }}</td>
        <td>{{row.updated_at | toMilliseconds | dateTime }}</td>
        <td ng-if="selectedTab === 'in_progress'">
          <cancel-query-button query-id="row.query_id" task-id="row.task_id"></cancel-query-button>
        </td>
      </tr>
      </tbody>
    </table>
    <paginator paginator="$ctrl.tasksPaginator"></paginator>

    <div class="p-15">
      <label><input type="checkbox" ng-model="autoUpdate"> Auto Update</label>
    </div>
  </div>
</div>
